<!-- 我的成绩 -->
<template>
    <div>
        <el-card shadow="never" v-loading="loading" body-style="padding: 24px;" class="card-margin">
            <h1 class="condition-title" style="padding-bottom: 60px;">{{ $t('myResults.competitionList') }}</h1>
            <edu-table :pagination="false" :selection='true' :order='false' :tooltipEffect="tooltipEffect" stripe :data="dataList" @selection-change="handleSelectionChange">
                <edu-table-column :label="$t('myResults.competitionTitle')" prop="competitionName"></edu-table-column><!-- 竞赛标题 -->
                <edu-table-column :label="$t('myResults.year')" prop="year"></edu-table-column><!-- 年度 -->
                <edu-table-column :label="$t('myResults.name')" prop="studentName"></edu-table-column><!-- 姓名 -->
                <edu-table-column :label="$t('myResults.admissionCard')" prop="examCardNo"></edu-table-column><!-- 准考证号 -->
                <edu-table-column :label="$t('myResults.result')" prop="score"></edu-table-column><!-- 成绩 -->
                <edu-table-column :label="$t('myResults.rank')" prop="level"></edu-table-column><!-- 等第 -->
                <!-- 状态 -->
                <edu-table-column :label="$t('myResults.status')" prop="status" align="center">
                    <template slot-scope="scope">
                        <el-tag
                            v-if="scope.row.status === 0"
                            type="danger"
                            plain>
                            {{ '缺考'}}
                        </el-tag>
                        <el-tag
                            v-if="scope.row.status === 1"
                            type="success"
                            plain>
                            {{ '正常' }}
                        </el-tag>
                        <el-tag
                            v-if="scope.row.status === 2"
                            type="warning"
                            plain>
                            {{ '请假' }}
                        </el-tag>
                    </template>
                </edu-table-column>
            </edu-table>
            <el-row type="flex" class="row-bg" justify="end">
                <el-col>
                    <el-pagination
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                        :current-page="queryForm.pageNum_"
                        :page-sizes="[20, 40, 80, 100]"
                        :page-size="queryForm.pageSize_"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="total_"
                        style="float:right;margin-top:10px">
                    </el-pagination>
                </el-col>
            </el-row>
        </el-card>
    </div>
</template>
<script>
import { queryDic } from 'common/src/api/dictionary'
import UTILS from 'common/src/utils/utils'
import competitionRuleApi from 'common/src/api/competitionRegistration/competitionRegistration'
export default {
    data() {
        return {
            total_: 0,
            queryForm: {
                pageNum_: 1,
                pageSize_: 20,
                condition: {}
            },
            dataList: [],
            multipleSelection: []
        }
    },
    filters: {
        status (val) {
            switch (val) {
                case 0: 
                    return '缺考'
                case 1:
                    return '正常'
                case 2:
                    return '请假'
                default:
                    return ''
            }
        }
    },
    created() {
        this.getMyResultApi(this.queryForm)
    },
    methods: {
        // 查询接口
        getMyResultApi(data) {
            competitionRuleApi.listPage(this.queryForm).then(res => {
                this.dataList = res.data.list
                this.total_ = res.data.total_
                this.multipleSelection = []
            })
        },
        // 勾选
        handleSelectionChange(val) {
            this.multipleSelection = val
        },
        // 分页
        handleSizeChange(val) {
            this.queryForm.pageSize_ = val
            this.queryForm.pageNum_ = 1
            this.getMyResultApi(this.queryForm)
        },
        // 分页
        handleCurrentChange(val) {
            this.queryForm.pageNum_ = val
            this.getMyResultApi(this.queryForm)
        }
    },

}
</script>
<style lang="scss" scoped>

</style>